import {createApp} from 'vue';
import App from './app.vue';
import {
  Card,
  Message,
  Select,
  DatePicker,
  Option,
  Input,
  Button,
  Tabs,
  TabPane,
  Table,
  Modal,
  Icon,
  Menu,
  MenuItem,
  Page,
  Tooltip,
} from 'view-ui-plus';
import '@/styles/index.less';
// import store from '../store/index.js';

joinContent (App);
injectJsInsert ();
function joinContent (element) {
  const div = document.createElement ('div');
  div.id = 'joinContentApp';
  document.body.appendChild (div);
  const app = createApp (element);
  // app.use (store);
  app
    .component ('Card', Card)
    .component ('Select', Select)
    .component ('DatePicker', DatePicker)
    .component ('Option', Option)
    .component ('Input', Input)
    .component ('Button', Button)
    .component ('Tabs', Tabs)
    .component ('TabPane', TabPane)
    .component ('Table', Table)
    .component ('Message', Message)
    .component ('Modal', Modal)
    .component ('Icon', Icon)
    .component ('Menu', Menu)
    .component ('MenuItem', MenuItem)
    .component ('Page', Page)
    .component ('Tooltip', Tooltip);
  app.mount ('#joinContentApp');
}

function injectJsInsert () {
  document.addEventListener ('readystatechange', () => {
    const injectPath = 'js/inject.js';
    const script = document.createElement ('script');
    script.setAttribute ('type', 'text/javascript');
    script.src = chrome.extension.getURL (injectPath);
    document.body.appendChild (script);
  });
}
